// import { fontFamily } from 'tailwindcss/defaultTheme'
export default {
    darkMode: ['class', '&:is(.dark *)'], // 对应你的 @custom-variant
    content: [
        "./index.html",
        "./src/**/*.{js,ts,jsx,tsx}",
    ],
    theme: {
        container: {
            center: true,
            padding: "2rem",
        },
        extend: {
            // 颜色配置（对应 :root 和 .dark 的变量）
            colors: {
                background: "hsl(var(--background))",
                foreground: "hsl(var(--foreground))",
                card: "hsl(var(--card))",
                cardForeground: "hsl(var(--card-foreground))",
                popover: "hsl(var(--popover))",
                popoverForeground: "hsl(var(--popover-foreground))",
                primary: {
                    DEFAULT: "hsl(var(--primary))",
                    foreground: "hsl(var(--primary-foreground))",
                },
                secondary: {
                    DEFAULT: "hsl(var(--secondary))",
                    foreground: "hsl(var(--secondary-foreground))",
                },
                muted: {
                    DEFAULT: "hsl(var(--muted))",
                    foreground: "hsl(var(--muted-foreground))",
                },
                accent: {
                    DEFAULT: "hsl(var(--accent))",
                    foreground: "hsl(var(--accent-foreground))",
                },
                destructive: {
                    DEFAULT: "hsl(var(--destructive))",
                    foreground: "hsl(var(--destructive-foreground))",
                },
                border: "hsl(var(--border))",
                input: "hsl(var(--input))",
                ring: "hsl(var(--ring))",
                // 图表色
                chart: {
                    1: "hsl(var(--chart-1))",
                    2: "hsl(var(--chart-2))",
                    3: "hsl(var(--chart-3))",
                    4: "hsl(var(--chart-4))",
                    5: "hsl(var(--chart-5))",
                },
                // 侧边栏色
                sidebar: {
                    DEFAULT: "hsl(var(--sidebar))",
                    foreground: "hsl(var(--sidebar-foreground))",
                    primary: {
                        DEFAULT: "hsl(var(--sidebar-primary))",
                        foreground: "hsl(var(--sidebar-primary-foreground))",
                    },
                    accent: {
                        DEFAULT: "hsl(var(--sidebar-accent))",
                        foreground: "hsl(var(--sidebar-accent-foreground))",
                    },
                    border: "hsl(var(--sidebar-border))",
                    ring: "hsl(var(--sidebar-ring))",
                },
            },
            // 圆角配置
            borderRadius: {
                sm: "calc(var(--radius) - 4px)",
                md: "calc(var(--radius) - 2px)",
                lg: "var(--radius)",
                xl: "calc(var(--radius) + 4px)",
            },
            // 字体配置
            // fontFamily: {
            //     sans: ["var(--font-sans)", ...fontFamily.sans],
            //     serif: ["var(--font-serif)", ...fontFamily.serif],
            //     mono: ["var(--font-mono)", ...fontFamily.mono],
            // },
            // 阴影配置
            boxShadow: {
                "2xs": "var(--shadow-2xs)",
                xs: "var(--shadow-xs)",
                sm: "var(--shadow-sm)",
                DEFAULT: "var(--shadow)",
                md: "var(--shadow-md)",
                lg: "var(--shadow-lg)",
                xl: "var(--shadow-xl)",
                "2xl": "var(--shadow-2xl)",
            },
        },
    },
    plugins: [
        // 添加对自定义变体的支持（对应 @custom-variant）
        // function ({ addVariant }) {
        //     addVariant('dark', '&:is(.dark *)')
        // },
        // require('tailwindcss-animate'),
        // 处理markdown语法的插件
        require('@tailwindcss/typography'),
    ],
}